/**
 * 文件作用：应用入口（Bootstrap），负责：
 * 1) 加载运行时配置与（可选）mock 数据；
 * 2) 创建 Vue 应用实例；
 * 3) 注册路由与状态管理；
 * 4) 将应用挂载到 DOM。
 * 说明：本项目演示 Vue + Axios 的最佳实践，默认启用本地 mock 以便离线运行；
 * 如需联调真实后端，请在 `src/config.js` 中关闭 `USE_MOCK` 并配置 `vue.config.js` 的代理。
 */
import { createApp } from 'vue' // 引入 Vue 3 的应用创建方法，用于生成应用实例
import App from './App.vue' // 根组件，提供导航与路由出口
import router from './router' // 路由实例，声明不同视图的路径与组件映射
import store from './store' // Vuex 状态管理，统一维护认证与错误等全局状态
import { CONFIG } from './config' // 运行时配置（BASE_URL / USE_MOCK / PAGE_SIZE 等）
import { bootstrapMock } from './mock/bootstrap' // mock 初始化：加载示例数据供适配器读取

// 可选：在应用启动阶段初始化 mock 数据。
// 说明：该函数为异步操作，不会阻塞应用创建；Axios 的自定义 adapter 会在数据可用后正常工作。
if (CONFIG.USE_MOCK) {
  bootstrapMock() // 启用本地 mock，便于无后端时的演示与开发
}

// 创建应用实例并注册插件（路由/状态），随后挂载到页面
const app = createApp(App)
app.use(router) // 注册路由，使 <router-view> 生效
app.use(store) // 注册 Vuex，使组件可通过 this.$store 访问全局状态
app.mount('#app') // 将应用挂载到 public/index.html 中的 #app 节点